@import './abstracts/variable';
@import './abstracts/mixin';

@include b(swipe) {
  position: relative;
  overflow: hidden;

  @include e(container) {
    white-space: nowrap;
  }
  @include e(indicators) {
    position: absolute;
    display: inline-block;
    left: 50%;
    bottom: $-swipe-indicators-bottom;
    transform: translate(-50%, -50%);
    font-size: 0;
  }
  @include e(indicator) {
    display: inline-block;
    width: $-swipe-indicator-size;
    height: $-swipe-indicator-size;
    border-radius: 50%;
    margin-right: 6px;

    &:last-child {
      margin-right: 0;
    }
  }
  @include when(vertical) {
    .wd-swipe__container {
      white-space: normal;
    }
    .wd-swipe-item {
      display: block;
    }
    .wd-swipe__indicators {
      left: $-swipe-indicators-vertical-left;
      bottom: auto;
      top: 50%;
    }
    .wd-swipe__indicator {
      display: block;
      margin-right: 0;
      margin-bottom: 6px;

      &:last-child {
        margin-bottom: 0;
      }
    }
  }
}